분류
목차
1. 📍 코스 당일 작성 영역
1.1. Phase A 산출물 양식 — 1차 (AI 없이, 40분)
1.1.1. [기본 정보] (1차)1.1.2. ⭐ Q1. 이 프로젝트는 한 문장으로 무엇인가? (1차)1.1.3. ⭐ Q2. 환경 설정 + 빌드 + 실행 — "일단 돌려보기"까지 (1차)1.1.4. ⭐ Q3. 사용 라이브러리 점검 (1차)1.1.5. ⭐ Q4. 구조 지도 — Entry point와 핵심 모듈 (1차)1.1.6. ✨ Q5. 로그 처리 방식 (1차)1.1.7. ⭐ Q6. 반드시 알아야 할 도메인 개념 3~5개 (1차)1.1.8. Q7. 이번에 추가/수정할 기능은? (1차)1.1.9. Q8. 어디를 손대야 하는가 (1차)1.1.10. Q9. 변경의 영향 범위 (1차)1.1.11. Q10. 막혔던 부분 / 더 알아봐야 할 것 (1차)
1.2. Phase A 산출물 양식 — 2차 (AI 활용, 30분)1.2.1. [기본 정보] (2차)1.2.2. ⭐ Q1. 이 프로젝트는 한 문장으로 무엇인가? (2차)1.2.3. ⭐ Q2. 환경 설정 + 빌드 + 실행 (2차)1.2.4. ⭐ Q3. 사용 라이브러리 점검 (2차)1.2.5. ⭐ Q4. 구조 지도 (2차)1.2.6. ✨ Q5. 로그 처리 방식 (2차)1.2.7. ⭐ Q6. 도메인 개념 3~5개 (2차)1.2.8. Q7. 추가/수정할 기능 (2차)1.2.9. Q8. 어디를 손대야 하는가 (2차)1.2.10. Q9. 변경의 영향 범위 (2차)1.2.11. Q10. 막혔던 부분 / 더 알아봐야 할 것 (2차)
1.3. Phase B AI 협업 회고 노트 — 1차 (코스 당일, HRCare)1.3.1. [기본 정보] (Phase B 1차)1.3.2. Q1. 오늘 사용한 prompting 패턴 (Phase B 1차)1.3.3. Q2. 가장 인상 깊었던 prompt 1개 (Phase B 1차)1.3.4. Q3. 한 줄 교훈 (Phase B 1차)
1.4. Phase C 검수보고서 — 1차 (코스 당일, HRCare)안녕하세요. OOO님!
HRCare 사업부 AI코딩 준비 서비스를 이용해주셔서 너무 감사드립니다!
본 페이지는 AI 코딩 준비 서비스 학습자용 통합 산출물 페이지입니다.
0.1. 페이지 사용 안내 [편집]
- 코스 당일: Phase A 1차/2차, Phase B 회고 노트, Phase C 검수보고서 (4개 산출물)
- 1주일 후 (본인 업무 코드에 적용): Phase A 3차, Phase B 회고 노트, Phase C 검수보고서, 만족도 조사
- 모두 채워서 검수 미팅에 가져오시면 50만 CAS 페이백 지급
0.2. 학습자 정보 [편집]
- 이름: 최수지님
- 소속보장사업부:
- 서비스 이용일: 2026년 5월 12일~13일
- 기수: 1
1. 📍 코스 당일 작성 영역 [편집]
1.1. Phase A 산출물 양식 — 1차 (AI 없이, 40분) [편집]
빈 칸이 많이 남아도 괜찮습니다. 비워두는 게 곧 비교 데이터입니다.
1.1.1. [기본 정보] (1차) [편집]
- 분석 대상 코드: teatime_backend_learning, teatime-next-tx_learning
- 작성일: 2026-05-13
1.1.2. ⭐ Q1. 이 프로젝트는 한 문장으로 무엇인가? (1차) [편집]
누가, 무엇을 위해, 어떤 문제를 푸는 시스템?
답:
1.1.3. ⭐ Q2. 환경 설정 + 빌드 + 실행 — "일단 돌려보기"까지 (1차) [편집]
첫 코드를 만났을 때 가장 큰 관문. 여기를 통과하면 절반은 한 것.
1. BE
- 주요 언어 / 프레임워크: spring boot, java, gradle, mariaDB
- 설정 파일 위치 및 핵심 항목: build.gradle
- 빌드 방법: IDE에서 빌드
- 실행 방법: IDE에서 실행
- 연결되어야 하는 외부 시스템 (DB, API, 큐 등): mariaDB 연동 필요
- ✨ "이걸 안 맞추면 실행이 안 된다" 싶은 함정: 기타 java 등 버전
2. FE
- 주요 언어 / 프레임워크: typescript, node, next, react
- 설정 파일 위치 및 핵심 항목: package.json
- 빌드 방법: yarn 빌드 (IDE 등 터미널로 가능). package.json 명령어로 빌드
- 실행 방법: yarn 실행. package.json 명령어로 빌드
- 연결되어야 하는 외부 시스템 (DB, API, 큐 등):
- ✨ "이걸 안 맞추면 실행이 안 된다" 싶은 함정: 기타 node 등 버전
1.1.4. ⭐ Q3. 사용 라이브러리 점검 (1차) [편집]
- BE
- 의존성 파일 위치: build.gradle
- 핵심 라이브러리 3~5개와 용도:
- spring boot
- mariaDB
- JWT
- AWS S3 SDK
- ✨ 처음 보거나 특이한 라이브러리: ZXing QR, firebase-admin 등등
2. FE
- 의존성 파일 위치: package.json
- 핵심 라이브러리 3~5개와 용도:
- next
- react
- typescript
- ✨ 처음 보거나 특이한 라이브러리: mui 등등등
1.1.5. ⭐ Q4. 구조 지도 — Entry point와 핵심 모듈 (1차) [편집]
- 실행이 시작되는 entry point:
- 핵심 폴더/모듈 3~5개와 각각의 역할:
1.1.6. ✨ Q5. 로그 처리 방식 (1차) [편집]
1. BE
- 사용하는 로그 라이브러리 / 방식: logback.xml
- 로그가 어디에 쌓이는가 (파일 / 콘솔 / 외부 시스템): 파일, 콘솔
- 에러 발생 시 추적할 수 있는 경로:
- 로그 레벨 정책: INFO
2. FE
- 사용하는 로그 라이브러리 / 방식:
- 로그가 어디에 쌓이는가 (파일 / 콘솔 / 외부 시스템): 콘솔
- 에러 발생 시 추적할 수 있는 경로:
- 로그 레벨 정책:
1.1.7. ⭐ Q6. 반드시 알아야 할 도메인 개념 3~5개 (1차) [편집]
코드를 이해하려면 알아야 할 핵심 용어
1.1.8. Q7. 이번에 추가/수정할 기능은? (1차) [편집]
- 한 줄로: H1. HRCare 공고 AI 요약 기능 추가
- 가장 비슷한 기존 기능이 어디 있는가: 외부 LLM API 호출?
1.1.9. Q8. 어디를 손대야 하는가 (1차) [편집]
- 수정 대상 파일/함수:
- 그 함수를 호출하는 곳 (caller):
- 그 함수가 호출하는 것 (callee):
1.1.10. Q9. 변경의 영향 범위 (1차) [편집]
- 영향 받을 수 있는 다른 기능/모듈:
- 관련 있는 기존 테스트:
- 로그를 추가/수정해야 할 지점:
1.1.11. Q10. 막혔던 부분 / 더 알아봐야 할 것 (1차) [편집]
솔직하게 — 검수 미팅에서 다룰 거리가 됩니다.
1. 전체적인 구조파악
2. 환경설정, 빌드 및 실행 방법
3. 소스 단에서 어디서 어디로 흐름이 이어지는지 상세한 확인이 필요합니다.
AI 없이 기존 아날로그 방식대로 하면, 오~~~래 걸립니다.
1.2. Phase A 산출물 양식 — 2차 (AI 활용, 30분) [편집]
1차에서 못 채운 부분을 김경송과 함께 AI 활용해 채웁니다. 1차와의 차이가 곧 'AI 효용 체감'입니다.
1.2.1. [기본 정보] (2차) [편집]
- 분석 대상 코드: teatime_backend_learning, teatime-next-tx_learning
- 작성일: 2026-05-13
1.2.2. ⭐ Q1. 이 프로젝트는 한 문장으로 무엇인가? (2차) [편집]
답: 사업부와 사용자를 중심으로 공지, 근태·휴가, 업무/모집, 계약·청구, CAS Pay 정산, 메신저를 통합 관리하는 HRCare 사내 운영 포털
1.2.3. ⭐ Q2. 환경 설정 + 빌드 + 실행 (2차) [편집]
- BE (teatime_backend_learning)
- 주요 언어 / 프레임워크: Java 17, Spring Boot 3.5.3, Gradle 8.7, MariaDB/JPA
- 주요 의존성: Spring Security, WebSocket, WebFlux, Quartz, Actuator, Caffeine Cache, JJWT,AWS S3 SDK, Firebase Admin, Web Push, springdoc Swagger
- 설정 파일 위치 및 핵심 항목: build.gradle, application.yml
- 위치: /build.gradle, src/main/resources/application-dev.yml
- 설정 파일 별 핵심 항목
- build.gradle
- Spring Boot 버전: 3.5.3
- Java: 17
- 앱 버전: 3.3.5.learning
- mainClass: castis.TeaTimeBackEndApplication
- 커밋/푸시 전 patch version 올려야 함
- application-dev.yml
- 서버 포트: 9093
- DB: MariaDB, jdbc:mariadb://.../ims
- JPA: ddl-auto: validate, open-in-view: false
- JWT secret/useJwt
- 업로드/로그 경로: /app/uploads, /app/logs
- CBank API URL
- Kakao/CoolSMS 설정
- AWS S3 bucket/region
- Messenger VAPID/FCM
- OpenAI API key: OPENAI_API_KEY_DEV 또는 OPENAI_API_KEY
- SecurityConfig.java
- CORS 허용 origin
- /login, /api/** CORS
- JWT 필터/permitAll 경로
- WebSocketConfig.java (line 17)
- Messenger WebSocket path: /ws/messenger
- 허용 origin: 운영/테스트/localhost 8082, 8083
- 빌드 방법:/teatime_backend_learning/gradlew clean build
- 테스트 제외 빌드./gradlew clean build -x test
- 실행 방법:cd /Users/suji/workspace/source/teatime_backend_learning
SPRING_PROFILES_ACTIVE=dev ./gradlew bootRun- 접속: http://localhost:9093
- 연결되어야 하는 외부 시스템:
- MariaDB 테스트 DB
- CBank API: OTP, transfer, account info, login, history
- Kakao 알림톡/CoolSMS/Nurigo
- AWS S3
- Firebase Admin SDK, FCM credentials
- Web Push VAPID
- Google Calendar holiday API
- Google Maps API, FE 출퇴근 지도
- SMTP: gwsmtp.ktbizoffice.com
- OpenAI API, skill suggestion
- ✨ 자주 까먹는 설정:
- BE는 application-dev.yml 기준이라 SPRING_PROFILES_ACTIVE=dev가 중요합니다.
- BE 실제 포트는 9093인데 Dockerfile.dev (line 45)는 9092를 expose/healthcheck로 보고 있어 불일치가 있습니다.
- 커밋/푸시 전 build.gradle (line 9) patch version 증가 규칙이 있습니다.
- DB 스키마 자동 변경은 꺼져 있습니다: ddl-auto: validate.
- Spring Boot 3라서 javax 말고 jakarta API를 써야 합니다.
- 일반 사용자 조회는 UserRepository 직접 주입보다 UserService 경유가 원칙입니다.
2. FE (teatime-next-tx_learning)
- 주요 언어 / 프레임워크: TypeScript, Next.js 14.2.5, React 18.3, MUI 5, Axios, SWR, Node 20.x, Yarn 1.22.22
- 설정 파일 위치 및 핵심 항목: package.json
- package.json
- yarn dev: Next dev server, port 8082
- yarn build: production build
- yarn start: production start, port 8082
- Node: 20.x
- package manager: yarn@1.22.22
- next.config.mjs (line 1)
- trailingSlash: true
- BUILD_STATIC_EXPORT: false
- NEXT_PUBLIC_APP_VERSION package version 주입
- SVG는 @svgr/webpack 사용
- 위치:
- 빌드 방법:cd /Users/suji/workspace/source/teatime-next-ts_learning
yarn install
yarn build
- 실행 방법:cd /Users/suji/workspace/source/teatime-next-ts_learning
yarn dev- 접속: http://localhost:8082
- 운영 빌드 실행:yarn build
yarn start
- 연결되어야 하는 외부 시스템:
- FE 옵션성 연동: Auth0, Supabase, AWS Amplify, Mapbox, AI chat bot URL
- ✨ 자주 까먹는 설정:
- FE는 NEXT_PUBLIC_SERVER_URL=http://localhost:9093 없으면 Axios baseURL이 빈 값이 됩니다.
- FE 포트를 바꾸면 BE CORS와 WebSocket allowed origins도 같이 확인해야 합니다.
1.2.4. ⭐ Q3. 사용 라이브러리 점검 (2차) [편집]
1. BE
- 의존성 파일 위치: build.gradle
- 핵심 라이브러리 3~5개와 용도:
라이브러리 | 용도 |
Spring Boot | 백엔드 애플리케이션 기반 프레임워크, REST API, DI, 설정, 실행 환경 담당 |
Spring Data JPA | DB 엔티티/Repository 기반 데이터 접근 |
Spring Security + JJWT | 인증/인가, JWT 기반 로그인 토큰 처리 |
- ✨ 특이한 라이브러리:
라이브러리 | 용도 |
Firebase Admin SDK | 모바일 앱 FCM 푸시 발송 |
Caffeine | 사용자 정보 캐싱에 사용. 이 repo에서는 UserService 캐시 규칙이 중요함 |
ZXing | QR 코드 생성. CAS Pay/Serviz Pay 계열 기능과 관련 있어 보임 |
2. FE
- 의존성 파일 위치: package.json
- 핵심 라이브러리 3~5개와 용도:
라이브러리 | 용도 |
Next.js + React | 프론트엔드 앱 프레임워크와 UI 구성 |
MUI | 공통 UI 컴포넌트, Data Grid, Date Picker 등 화면 구성 |
- ✨ 특이한 라이브러리:
라이브러리 | 용도 |
Supabase / AWS Amplify / Firebase | 외부 BaaS/클라우드 SDK가 여러 개 함께 있음 |
React Virtuoso | 대량 리스트 가상 스크롤 |
1.2.5. ⭐ Q4. 구조 지도 (2차) [편집]
1. BE
- Entry point: TeaTimeBackEndApplication.java
- 핵심 폴더/모듈 3~5개와 각각의 역할:
- domain: 핵심 비즈니스 도메인. 보통 controller/service/repository/entity/dto 구조.
- security: 인증/보안 쪽 핵심 모듈.
- config: Spring 설정, OpenAPI, 캐시, S3, 메일 등 인프라 설정.
- scheduler: 배치/스케줄 작업. 급여, 공고 만료, 출석, 알림 등 시간 기반 로직.
- exception: 전역 예외 처리와 커스텀 예외.
2. FE
- Entry point: layout.tsx
- 핵심 폴더/모듈 3~5개와 각각의 역할:
- app: Next.js App Router. URL 라우트, layout.tsx, page.tsx 진입 구조.
- sections: 실제 화면 단위 구현. attendance, job, recruit, pay, dashboard, user 같은 페이지 UI가 여기 있음.
- actions: BE API 호출/서버 액션 성격의 모듈. 도메인별 job.ts, pay.ts, user.ts, *-ssr.ts 등이 있음.
- auth: FE 인증 상태, guard, auth context.
- layouts: Dashboard/Auth/Pay/Simple 같은 공통 화면 골격.
1.2.6. ✨ Q5. 로그 처리 방식 (2차) [편집]
1. BE
- 사용하는 로그 라이브러리 / 방식:
- 라이브러리: Spring Boot 기본 Logback + Lombok @Slf4j
- 방식: Logback 기반 파일+콘솔 로그
- 로그가 어디에 쌓이는가:
- 파일: /app/logs/Saram.be.log
- 콘솔: 애플리케이션 stdout
- 에러 발생 시 추적 경로:1) 프론트에서 API 실패 확인- 브라우저 DevTools Network에서 실패한 API URL, status, response body 확인.
- 백엔드 로그 확인- 서버 기준:
bash
tail -f /app/logs/Saram.be.log
grep "ERROR" /app/logs/Saram.be.log
grep "2026-05-13 14:" /app/logs/Saram.be.log
grep "PayTransferService" /app/logs/Saram.be.log
3) 로그의 [파일:라인]으로 코드 진입
- Logback 포맷에 [파일명:라인]이 있으므로 예외 발생 위치를 바로 따라갈 수 있습니다.
4) API 응답 메시지 확인
- 공통 예외는 ExceptionAdvice에서 {"msg": "..."} 형태.
- 400/401/403/404/409/500 등이 여기서 처리됩니다.
- 400/401/403/404/409/500 등이 여기서 처리됩니다.
- 로그 레벨 정책: root level="INFO"라서 INFO/WARN/ERROR는 출력.
2. FE
- 사용하는 로그 라이브러리 / 방식:
- 별도의 라이브러리 없이 console 로그 출력, 일부 기능은 DB 이력 테이블에 쌓이는 방식
- 로그가 어디에 쌓이는가:
- 에러 발생 시 추적 경로:
- 로그 레벨 정책:
1.2.7. ⭐ Q6. 도메인 개념 3~5개 (2차) [편집]
- 사용자/인증/권한
- 조직 스코프: Team vs Division vs Unit
- Pay / CBank / 계좌 식별
1.2.8. Q7. 추가/수정할 기능 (2차) [편집]
- 한 줄로: HRCare 공고 AI 요약 기능 추가
- 가장 비슷한 기존 기능: Ai Tag
1.2.9. Q8. 어디를 손대야 하는가 (2차) [편집]
- 수정 대상 파일/함수: JobController 에 연결될 신규 service 생성, RecruitController 에 연결될 신규 service 생성 (ai 요약과 관련된)
- Caller: JobController, RecruitController
- Callee: JobSummaryService, RecruitSummaryService
1.2.10. Q9. 변경의 영향 범위 (2차) [편집]
- 영향 받을 수 있는 다른 기능/모듈: 없음
- 관련 있는 기존 테스트:
- 로그를 추가/수정해야 할 지점: ai요약 명령 수행하다 에러 등 나는 지점.
1.2.11. Q10. 막혔던 부분 / 더 알아봐야 할 것 (2차) [편집]
openai 연결하는 키가 유료기도 하고, 로컬에서 먼저 테스트하려다 보니
dev 환경에서 구동하도록 설정값과 adaptor를 분리한점.
1.3. Phase B AI 협업 회고 노트 — 1차 (코스 당일, HRCare) [편집]
들은 것은 30% 남고, 본 것은 50%, 직접 한 것은 75% 남습니다.
1.3.1. [기본 정보] (Phase B 1차) [편집]
- 선택한 과제: H1
- 작성일: 2026.05.28
1.3.2. Q1. 오늘 사용한 prompting 패턴 (Phase B 1차) [편집]
패턴 | 썼나? | 대략 몇 번 |
🟢 패턴 1. 기본 4단계 부탁 | O | |
🟡 패턴 2. 에러 그대로 복붙 | O | 계속 |
🔵 패턴 3. 받은 코드 검토 질문 | O | 계속 |
🟣 패턴 4. 테스트 코드 부탁 | O |
1.3.3. Q2. 가장 인상 깊었던 prompt 1개 (Phase B 1차) [편집]
잘 됐든 안 됐든 상관없어요. 가장 기억에 남는 사례를 고르세요.
(2-1) 내가 보낸 prompt — 그대로 복붙
지금 소스에 로컬용으로 구동하려고 (openai 대신)
ChatCompletionsClient, ChatCompletionsProperties
이런게 새로 추가한걸로 알고있는데
이거 제거하거나 놔둬도 live 는 문제없을까
(2-2) AI 답변 핵심 요약
**놔두면 live에서 문제 생겨요.** 이유를 설명할게요:
**문제 1: RecruitSummaryService, JobSummaryService**
원본 코드는 `OpenAiResponsesClient`를 주입받았는데, 지금은 `ChatCompletionsClient`로 바뀐 상태예요. live 서버에서도 `ChatCompletionsClient` 빈이 필요해요.
**문제 2: `ai.chat.*` 설정**
`ChatCompletionsProperties`가 `ai.chat.api-key`, `ai.chat.api-url`, `ai.chat.model`을 읽는데, 이게 `application-dev.yml`에만 있고 live yml에는 없으면 빈 값으로 뜨거나 기동 실패할 수 있어요.
---
**커밋 전 롤백 방법** (마커 달린 곳 원복):
`RecruitSummaryService`, `JobSummaryService`에서 `// 원본:` 주석 복원하고, `ChatCompletionsClient` → `OpenAiResponsesClient`로 되돌리면 돼요.
`ChatCompletionsClient.java`, `ChatCompletionsProperties.java` 파일 자체는 그냥 삭제하면 끝이고요.
---
**아니면 live에도 적용하고 싶다면:**
`ai.chat.*`을 live yml에도 추가하고 (OpenAI key 넣어서), `ChatCompletionsClient`를 정식 코드로 올리는 방법도 있어요.
어떻게 하실 계획이에요? 로컬 테스트용으로만 유지하고 커밋 전 롤백 예정인가요?
(2-3) 그 답변을 어떻게 처리했나?
- ☐ 완전히 버리고 다시 물어봄
(2-4) 수정 / 버렸다면 이유:
* 프로파일(live/dev) 에 관계없이 소스 구동되도록 수정하고자 새로 질의.
1.3.4. Q3. 한 줄 교훈 (Phase B 1차) [편집]
다음에 비슷한 상황에서 다시 꺼내볼 수 있는 한 줄로.
"프로파일에 따라 구동이 안될 수 있는경우, 가능한 어뎁터 구조를 상정해서 prompt에 질의하자"
1.4. Phase C 검수보고서 — 1차 (코스 당일, HRCare) [편집]
Phase C의 핵심은 "내가 한 일을 글로 정리하는 능력"입니다.
1.4.1. [기본 정보] (Phase C 1차) [편집]
- 작성자 / 작업일: 최수지 / 2025.05.28
- 선택한 과제 (L1~L4 / H1~H3): H1
1.4.2. Part 1. 변경 요약 (Phase C 1차) [편집]
Q1. 무엇을 바꿨나? (한 줄로): 공고의 AI요약 기능 추가
Q2. 왜 바꿨나? (배경 / 요구사항):공고 내용이 길때, 간략하게 보기위함
1.4.3. Part 2. 변경 내역 (Phase C 1차) [편집]
Q3. 수정한 파일 / 함수:
- 파일 `[파일 경로]` — 함수 `[함수명]`
Q4. Before → After 핵심 차이:
Before:
[변경 전 핵심 코드]
After:
[변경 후 핵심 코드]
1.4.4. Part 3. 검증 (Phase C 1차) [편집]
Q5. 동작을 어떻게 확인했나? (수동 테스트 시나리오):
- 로컬에 LLM 구동
- job post / recruit 각각 AI 요약 확인
- TB 올려서 한번더 확인 필요
Q6. 작성한 단위 테스트:
- 테스트 개수: 12개
- 커버한 케이스 (정상/경계값/에러): 정상2개, 경계값6개, 에러8개
정상 (2개, 각 1개)
summarize_정상요약_헤더푸터포함
경계값 (6개, 각 3개)
summarize_content없어도_제목으로_동작
summarize_HTML태그포함_content_정상요약
summarize_모든필드있을때_정상요약
에러 (8개, 각 4개)
summarize_apiKey없으면_예외
summarize_공고없으면_예외
summarize_AI결과비어있으면_예외
summarize_AI예외발생시_RuntimeException래핑
Q7. 작업 중 발견한 버그 / 수정한 것:
summarize_정상요약_헤더푸터포함
경계값 (6개, 각 3개)
summarize_content없어도_제목으로_동작
summarize_HTML태그포함_content_정상요약
summarize_모든필드있을때_정상요약
에러 (8개, 각 4개)
summarize_apiKey없으면_예외
summarize_공고없으면_예외
summarize_AI결과비어있으면_예외
summarize_AI예외발생시_RuntimeException래핑
Q7. 작업 중 발견한 버그 / 수정한 것:
1.4.5. Part 4. 영향 범위 (Phase C 1차) [편집]
Q8. 영향 받을 수 있는 다른 기능 / 모듈: 다른 기능은 문제없음. 영향이 있으면, 아마 AI요약 기능이 다른 프로파일에서 불가능한 경우
Q9. 예상 vs 실제 — 차이가 있었나?
- 예상한 영향:
- 실제 영향:
- 차이의 이유:
1.4.6. Part 5. 잔여 사항 (Phase C 1차) [편집]
Q10. 알려진 한계 / 미해결 이슈: openai 기능을 사용하는 다른 기능들이 로컬에서 구동하게끔 수정되면 좋을 것 같습니다.
Q11. 다음에 더 다듬을 부분: 시간상, ui적인 측면을 신경쓰지못해, Ui관점에서 예쁘게 배치하면 좋을듯합니다.